<template>
  <div>
    <el-tree-select ref="treeSelect" v-model="values" :treeParams="treeParams" :selectParams="selectParams" class="my-area-select"/>
  </div>
</template>

<script>
  import util from '@/libs/util'
  export default {
    name: "my-area-select",
    props: {
      value: {
        type: Array,
        required: true
      }
    },
    data() {
      return {
        values: [],
        selectParams: {
          size: 'mini'
        },
        treeParams: {
          'default-expand-all': true,
          data: [],
          props: {
            children: 'children',
            label: 'name',
            disabled: 'disabled',
            value: 'id'
          }
        }
      }
    },
    watch: {
      value(val) {
        this.values = val;
      },
      values() {
        this.$emit('input', this.values)
      }
    },
    created() {

      this.$api.admin_area_getList().then(res=>{
        let tree = util.getTree(res)
        this.$refs.treeSelect.treeDataUpdateFun(tree);
      })
    }
  }
</script>

<style lang="scss">

</style>
